<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%--<!DOCTYPE html>--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>

<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="x-ua-compatible" content="ie=edge"/>
    <title>徐礼念教育-家居网购</title>
    <base href="<%=request.getContextPath()+"/"%>">

    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"/>
    <link rel="stylesheet" href="assets/css/vendor/vendor.min.css"/>
    <link rel="stylesheet" href="assets/css/plugins/plugins.min.css"/>
    <link rel="stylesheet" href="assets/css/style.min.css"/>
</head>

<body>
<!-- Header Area start  -->
<div class="header section">
    <!-- Header Top Message Start -->
    <!-- Header Top  End -->
    <!-- Header Bottom  Start -->
    <div class="header-bottom d-none d-lg-block">
        <div class="container position-relative">
            <div class="row align-self-center">
                <!-- Header Logo Start -->
                <div class="col-auto align-self-center">
                    <div class="header-logo">

                        <a href="index.jsp"><h4>徐礼念家居——线上购物商城</h4></a>

                    <%--<a href="index.html"><img src="assets/images/logo/logo.png" alt="Site Logo"/></a>--%>
                    </div>
                </div>
                <!-- Header Logo End -->
                <!-- Header Action Start -->
                <div class="col align-self-center">
                    <div class="header-actions">
                        <div class="header-bottom-set dropdown">
                            <a>欢迎: ${sessionScope.member.username}</a>
                        </div>
                        <div class="header-bottom-set dropdown">
                            <a href="OrderServlet?action=cartList">订单管理</a>
                        </div>
                        <div class="header-bottom-set dropdown">
                            <a href="memberServlet?action=logout">安全退出</a>
                        </div>
                    </div>
                </div>
                <!-- Header Action End -->
            </div>
        </div>
    </div>
    <!-- Header Bottom  Start 手机端的header -->
    <div class="header-bottom d-lg-none sticky-nav bg-white">
        <div class="container position-relative">
            <div class="row align-self-center">
                <!-- Header Logo Start -->
                <div class="col-auto align-self-center">
                    <div class="header-logo">
                        <a href="index.html"><img width="280px" src="assets/images/logo/logo.png"
                                                  alt="Site Logo"/></a>
                    </div>
                </div>
                <!-- Header Logo End -->
            </div>
        </div>
    </div>
    <!-- Main Menu Start -->
    <div style="width: 100%;height: 50px;background-color: black"></div>
    <!-- Main Menu End -->
</div>
<!-- Header Area End  -->

<!-- OffCanvas Cart Start -->

<!-- OffCanvas Cart End -->

<!-- OffCanvas Menu Start -->

<!-- OffCanvas Menu End -->


<!-- breadcrumb-area start -->


<!-- breadcrumb-area end -->

<!-- Cart Area Start -->
<div class="cart-main-area pt-100px pb-100px">
    <div class="container">
        <h3 class="cart-page-title">订单-${requestScope.orderId}</h3>
        <div class="row">
            <div class="col-lg-12 col-md-12 col-sm-12 col-12">
                <form action="#">
                    <div class="table-content table-responsive cart-table-content">
                        <table>
                            <thead>
                            <tr>

                                <th>家居名</th>
                                <th>单价</th>
                                <th>数量</th>
                                <th>金额</th>

                            </tr>
                            </thead>
                            <tbody>
                            <c:forEach items="${requestScope.orderItemPage.items}" var="orderItem">
                            <tr>
                                <td class="product-name"><a href="#">${orderItem.name}</a></td>
                                <td class="product-price-cart"><span class="amount">$${orderItem.price}</span></td>
                                <td class="product-quantity">${orderItem.count}</td>
                                <td class="product-subtotal">$${orderItem.totalPrice}</td>
                            </tr>
                            </c:forEach>
                            <%--<tr>--%>
                            <%--    <td class="product-name"><a href="#">Product Name</a></td>--%>
                            <%--    <td class="product-price-cart"><span class="amount">$60.00</span></td>--%>
                            <%--    <td class="product-quantity">12</td>--%>
                            <%--    <td class="product-subtotal">$70.00</td>--%>
                            <%--</tr>--%>
                            </tbody>
                        </table>
                    </div>
                    <div class="row">
                        <div class="col-lg-12">
                            <div class="cart-shiping-update-wrapper">
                                <p style="font-weight: bold">共${requestScope.orderItemTotalCount}件商品 ${requestScope.orderItemPage.totalRow}件家居 总价 ${requestScope.totalPrice}元</p>
                                <%--<h4>共${requestScope.orderItemTotalCount}件商品 ${requestScope.orderItemPage.totalRow}件家居 总价 ${requestScope.totalPrice}元</h4>--%>
                                <div class="cart-clear">
                                    <a href="#">继 续 购 物</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </form>

            </div>
        </div>
    </div>
</div>
<!-- Cart Area End -->

<%--分页！！！！！！！！！！--%>
<div class="pro-pagination-style text-center mb-md-30px mb-lm-30px mt-6" data-aos="fade-up">
    <li><a href="${requestScope.orderItemPage.url}&pageNo=1">首页</a></li>
    <c:if test="${requestScope.orderItemPage.pageNo > 1}">
        <li><a href="${requestScope.orderItemPage.url}&pageNo=${requestScope.orderItemPage.pageNo-1}">上页</a></li>
    </c:if>

    <c:set var="begin" value="1"/>
    <c:set var="end" value="${requestScope.orderItemPage.pageTotalConut}"/>
    <c:forEach begin="${begin}" end="${end}" var="i">
        <c:if test="${requestScope.orderItemPage.pageNo == i}">
            <li><a class="active" href="#">${i}</a></li>
        </c:if>
        <c:if test="${i != requestScope.orderItemPage.pageNo}">
            <li><a href="${requestScope.orderItemPage.url}&pageNo=${i}">${i}</a></li>
        </c:if>
    </c:forEach>
    <%--<li><a href="#">4</a></li>--%>
    <%--<li><a href="#">5</a></li>--%>

    <c:if test="${requestScope.orderItemPage.pageNo != requestScope.orderItemPage.pageTotalConut}">
        <li><a href="${requestScope.orderItemPage.url}&pageNo=${requestScope.orderItemPage.pageNo+1}">下页</a></li>
    </c:if>
    <li><a href="${requestScope.orderItemPage.url}&pageNo=${requestScope.orderItemPage.pageTotalConut}">末页</a></li>
    <li><a href="#">共${requestScope.orderItemPage.pageTotalConut}页</a></li>
    <li><a>共${requestScope.orderItemPage.totalRow}记录</a></li>

</div>
<%--分页！！！！！！！！！！！！！！--%>

<!-- Footer Area Start -->
<div class="footer-area">
    <div class="footer-container">
        <div class="footer-top">
            <div class="container">
                <div class="row">
                    <!-- Start single blog -->
                    <!-- End single blog -->
                    <!-- Start single blog -->
                    <div class="col-md-6 col-sm-6 col-lg-3 mb-md-30px mb-lm-30px" data-aos="fade-up"
                         data-aos-delay="400">
                        <div class="single-wedge">
                            <h4 class="footer-herading">信息</h4>
                            <div class="footer-links">
                                <div class="footer-row">
                                    <ul class="align-items-center">
                                        <li class="li"><a class="single-link" href="about.html">关于我们</a></li>
                                        <li class="li"><a class="single-link" href="#">交货信息</a></li>
                                        <li class="li"><a class="single-link" href="privacy-policy.html">隐私与政策</a></li>
                                        <li class="li"><a class="single-link" href="#">条款和条件</a></li>
                                        <li class="li"><a class="single-link" href="#">制造</a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- End single blog -->
                    <!-- Start single blog -->
                    <div class="col-md-6 col-lg-2 col-sm-6 mb-lm-30px" data-aos="fade-up" data-aos-delay="600">
                        <div class="single-wedge">
                            <h4 class="footer-herading">我的账号</h4>
                            <div class="footer-links">
                                <div class="footer-row">
                                    <ul class="align-items-center">
                                        <li class="li"><a class="single-link" href="my-account.html">我的账号</a>
                                        </li>
                                        <li class="li"><a class="single-link" href="cart.html">我的购物车</a></li>
                                        <li class="li"><a class="single-link" href="login.html">登录</a></li>
                                        <li class="li"><a class="single-link" href="wishlist.html">感兴趣的</a></li>
                                        <li class="li"><a class="single-link" href="checkout.html">结账</a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- End single blog -->
                    <!-- Start single blog -->
                    <div class="col-md-6 col-lg-3" data-aos="fade-up" data-aos-delay="800">

                    </div>
                    <!-- End single blog -->
                </div>
            </div>
        </div>
        <div class="footer-bottom">
            <div class="container">
                <div class="row flex-sm-row-reverse">
                    <div class="col-md-6 text-right">
                        <div class="payment-link">
                            <img src="#" alt="">
                        </div>
                    </div>
                    <div class="col-md-6 text-left">
                        <p class="copy-text">Copyright &copy; 2021 韩顺平教育~</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- Footer Area End -->
<script src="assets/js/vendor/vendor.min.js"></script>
<script src="assets/js/plugins/plugins.min.js"></script>
<!-- Main Js -->
<script src="assets/js/main.js"></script>
</body>
</html>